<template>
  <el-table :data="arr" style="width: 100%">
    <el-table-column label="编号" width="100">
      <template slot-scope="scope">
        <span>{{ scope.row.id }}</span>
      </template>
    </el-table-column>
    <el-table-column label="用户名" width="110">
      <template slot-scope="scope">
        <span>{{ scope.row.name }}</span>
      </template>
    </el-table-column>
    <el-table-column label="人员编号" width="200">
      <template slot-scope="scope">
        <span>{{ scope.row.nameid }}</span>
      </template>
    </el-table-column>
    <el-table-column label="所属角色" width="190">
      <template slot-scope="scope">
        <span>{{ roleobj[scope.row.role] }}</span>
      </template>
    </el-table-column>
    <el-table-column label="说明" width="220">
      <template slot-scope="scope">
        <span>{{ explainobj[scope.row.explain] }}</span>
      </template>
    </el-table-column>
    <el-table-column label="新建时间" width="260">
      <template slot-scope="scope">
        <span style="margin-left: 10px">{{ scope.row.date }}</span>
      </template>
    </el-table-column>
    <el-table-column label="是否有效" width="90">
      <template slot-scope="scope">
        <span>{{ whetherobj[scope.row.whether] }}</span>
      </template>
    </el-table-column>
    <el-table-column label="操作" width="190">
      <template slot-scope="scope">
        <span @click="handleEdit(scope.row)"
          ><i class="el-icon-edit"></i>编辑</span
        >
        <span @click="handleDelete(scope.row.idd)"
          ><i class="el-icon-delete"></i>删除</span
        >
        <span @click="modifypwd(scope.row.id)"
          ><i class="el-icon-refresh-right"></i>重置密码</span
        >
      </template>
    </el-table-column>
  </el-table>
</template>
<script>
import{delwxApi} from '../../../api/wxapi/wxApi.js'
export default {
  props:['arr'],
  data() {
    return {
      pwd: 123456,
      roleobj: {
        //映射对象
        0: "管理员",
        1: "街道负责人",
      },
      explainobj: {
        0: "管理所有权限",
        1: "上传车位信息",
      },
      whetherobj: {
        0: "否",
        1: "是",
      },
      // tableData: [
      //   {
      //     id: 1,
      //     name: "王小虎",
      //     nameid: 20051147,
      //     role: 0, //0 管理员  1 街道负责人
      //     explain: 0, //0 管理所有权限 1 上传车位信息
      //     date: "2016-05-02 10:00:00",
      //     whether: 1, //0 否  1 是
      //   },
      //   {
      //     id: 2,
      //     name: "王小虎",
      //     nameid: 20051147,
      //     role: 0, //0 管理员  1 街道负责人
      //     explain: 0, //0 管理所有权限 1 上传车位信息
      //     date: "2016-05-02 10:00:00",
      //     whether: 1, //0 否  1 是
      //   },
      // ],
    };
  },
  methods: {
    handleEdit(row) {
      //编辑
      // console.log(row);
      this.$emit('updateopen',row)
    },
    handleDelete(idd) {
      delwxApi({idd:idd}).then(res=>{
        // console.log("res",res);
        if(res.code==200){
          this.$emit('resetwx')
            this.$message({
                  message: "删除成功",
                  type: "success",
                });
        }
      })
    },
    modifypwd(index) {
        this.$message({
          message: '编号为'+index+'用户密码重置成功',
          type: 'success'
        });
      console.log(index, this.pwd);
    },
  },
};
</script>
<style lang="less" scoped>
.el-table /deep/.el-table__cell {
  text-align: center;
}
/deep/.is-leaf{
  font-weight: 500;
  font-size: 14px;
  color: black;
}
/deep/.el-table__body{
  -webkit-border-vertical-spacing: 3px;
  background: #F3F1F6;
  // box-shadow: 10px 10px rgb(221, 63, 63);
}
span {
  font-size: 12px;
}
i {
  color: #A0A8F1;
  margin-right: 3px;
  margin-left: 6px;
}
/deep/.el-table__row{
   border-radius: 5px;
}
</style>